<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
</body>
<script>
    // function* helloWorldGenerator() {
    //     yield 'hello';
    //     yield 'world';
    //     return 'ending';
    // }

    // var hw = helloWorldGenerator();

    // 普通函数如何改 generator 函数?
    // (1) 在function关键词之后 加*
    // 形式上，Generator 函数是一个普通函数，但是有两个特征。
    // 一是，function关键字与函数名之间有一个星号；
    // 二是，函数体内部使用yield表达式，定义不同的内部状态（yield在英语里的意思就是“产出”）。

    // function fn(){
    //     return 3;
    // }

    function* fn(){
        console.log("第一次执行");
        yield 1;
        console.log("第二次执行");
        yield 2;
        console.log("第三次执行");
        return 3;
    }
    // 手动调用执行
    var obj = fn();
    console.log(obj);  // {}  有方法 next()

    var result = obj.next();
    console.log(result);   // {value: 1, done: false}

    var result = obj.next();
    console.log(result);   // {value: 2, done: false}

    var result = obj.next();
    console.log(result);   // {value: 3, done: true}

    var result = obj.next();
    console.log(result);   // {value: 3, done: true}

    // 遍历获取生成器函数(generator函数)的 产出值(yield return)
    // var obj = fn();
    // var arr = [];
    // do{
    //     var result = obj.next();
    //     arr.push(result.value);
    // }while(!result.done); //result.done==false   generator函数没有执行完毕
    // console.log(arr);

    // 官方提供  for...of (ES6)
    var obj = fn();
    for(var val of obj){
        console.log(val);
    }



    // 此处为了方便理解 模拟封装
    /* function fn(){
        var index = 0;  //指针  下标  =>  记录下标指针的位置
        return {
            next:function(){
                index++;  // next找不到 就向外跳一层 => 找父作用域
                if(index==1){
                    console.log("第一次执行");
                    return {value: 1, done: false}
                }else if(index==2){
                    console.log("第二次执行");
                    return {value: 2, done: false}
                }else if(index==3){
                    console.log("第二次执行");
                    return {value: 3, done: true}
                }else{
                    return {value: undefined, done: true}
                }
            }
        }
      
    }

    var obj = fn();  //{} 对象中有一个next方法
    console.log(obj);

    var result = obj.next()
    console.log(result);

    var result = obj.next()
    console.log(result);

    var result = obj.next()
    console.log(result);

    var result = obj.next()
    console.log(result); */



</script>
</html>